<!-- eslint-disable InnerIPLeak -->
<!-- eslint-disable max-len -->
<!-- eslint-disable no-restricted-syntax -->
<template>
  <!-- <div> -->
    <s-table
      ref="flowConfigTable"
      :columns="columns"
      :data="loadData"
      :showPagination="true"
      rowKey="key"
      :scrollX="1200"
      class="h100"
      wrapRef="ant-tabs-content"
    >
      <template #taskName="text, record">
        <auth-text :auth="todoPerms.review.view" @click="handleSeeDetail(record)">
          <table-ellipsis :text="record.instanceName"></table-ellipsis>
        </auth-text>
      </template>
      <template #businessName="text, record">
        <table-ellipsis :text="record.businessName"></table-ellipsis>
      </template>
      <template #cancelType="text, record">
        <table-ellipsis
          :text="record.cancelType?$options.filters.DictLabelFilter(record.cancelType,cancelTypeEnumArr) : '_'"
        >
        </table-ellipsis>
      </template>
      <template #taskStatus="text, record">
        <table-ellipsis
          :text="record.taskStatus?$options.filters.DictLabelFilter(record.taskStatus,taskStatusEnumArr) : '_'"
        >
        </table-ellipsis>
      </template>
      <template slot="auditTime" slot-scope="text">
        <table-ellipsis :text="text ? $options.filters.moment(text) : '_'"></table-ellipsis>
      </template>
      <template slot="createTime" slot-scope="text">
        <table-ellipsis :text="text ? $options.filters.moment(text) : '_'"></table-ellipsis>
      </template>
      <template #operation="text">
        <span>
          <auth-button type="primary" :ghost="true" size="small" :auth="todoPerms.review.audit" @click="clickRowOperation('auditProcess',text)"><a-icon type="pull-request" />{{ $t('auditProcess') }}</auth-button>
        </span>
      </template>
    </s-table>
  <!-- </div> -->
</template>
<script>
import { mapState } from 'vuex'
import STable from '@/components/Table/index1'
import tableEllipsis from '@/components/Ellipsis/TableEllipsis'
import AuthText from '@/components/AuthText'
import { todoPerms } from '@/config/permission/index'
import { doneColumns, cancelTypeEnumArr, taskStatusEnumArr } from '../config/list'
import AuthButton from '@/components/AuthButton'
export default {
  components: {
    STable,
    tableEllipsis,
    AuthText,
    AuthButton
  },
  props: {
    tableData: {
      type: Array,
      default: () => {
        return []
      }
    }
  },
  computed: {
    ...mapState({
      queryParams: (state) => state.myReview.queryParamsDone
    })
  },
  data () {
    return {
      columns: doneColumns,
      cancelTypeEnumArr,
      taskStatusEnumArr,
      todoPerms
    }
  },
  methods: {
    // 请求接口数据加载表格
    loadData (parameter) {
      const vm = this
      // 如果是全部则不传值给后端
      const JnqueryParam = JSON.parse(JSON.stringify(vm.queryParams))
      // eslint-disable-next-line no-restricted-syntax
      for (const key in JnqueryParam) {
        if (JnqueryParam[key] === '') {
          JnqueryParam[key] = undefined
        }
        if (JnqueryParam[key] instanceof Array) {
          JnqueryParam[key] = JnqueryParam[key].toString()
        }
      }
      return this.$api.getMyDealedAudit({ ...parameter, ...JnqueryParam })
    },
    // 刷新表格
    refreshData (isToFirstPage = true) {
      let obj = null
      if (isToFirstPage) {
        obj = { current: 1 }
      }
      this.$refs.flowConfigTable.loadData(obj)
    },
    // 点击操作按钮
    clickRowOperation (type, data) {
      this.$emit('operateRow', [type, data])
    },
    // 跳转审批流程
    auditProcess () {
      this.$message.info('跳转审批流程待做')
    },
    // 点击跳转申请内容详情
    handleSeeDetail (data) {
      this.$router.push({
        path: '/todo/applicationContent',
        query: {
          id: data.instanceId,
          swcode: data.businessCode,
          key: data.businessKey,
          p: data.taskId,
          // 是从我的申请跳转过去还是从我的审核跳转过去，会影响底部的操作信息栏加载
          aorr: 'r',
          midParam:data.taskStatus,
          status: data.taskStatus }
      })
    }
  }
}
</script>
<style lang="less" scoped>
.set-margin {
  margin-right: 12px;
}
</style>
